import { useStorage } from '@/hooks/web/useStorage'
import { defineStore } from 'pinia'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import en from 'element-plus/es/locale/lang/en'
import { store } from "../index.ts"
const { getStorage, setStorage } = useStorage('localStorage')

const elLocaleMap: any = {
  en: en,
  zhCN: zhCn,
}

interface LocaleState {
  currentLocale: {
    lang: LocaleType,
    elLocale: any
  },
  localeMap: {
    lang: LocaleType,
    name: string
  }[]
}

export const useLocaleStore = defineStore("locales", {
  state: (): LocaleState => {
    return {
      currentLocale: {
        lang: getStorage('lang') || 'zhCN',
        elLocale: elLocaleMap[getStorage('lang') || 'zhCN'],
      },
      localeMap: [
        {
          lang: "zhCN",
          name: "简体中文",
        },
        {
          lang: "en",
          name: "English"
        }
      ]
    }
  },
  getters: {
    getCurrentLocale(): any {
      return this.currentLocale;
    },
    getLocaleMap(): any {
      return this.localeMap;
    }
  },
  actions: {
    setCurrentLocale(localeMap: any) {
      this.currentLocale.lang = localeMap?.lang
      this.currentLocale.elLocale = elLocaleMap[localeMap?.lang]
      setStorage('lang', localeMap?.lang)
    }
  }
})

export const useLocaleStoreWithOut = () => {
  return useLocaleStore(store)
}
